<template>
    <div>
        <!-- 角色授权 -->
        <el-card style="height: 2500px" class="card">
            <!-- <div slot="header">
	            <span>组织结构管理</span>
	        </div> -->
            <el-row>
                <el-form inline="true">
                    <el-form-item label="">
                        <template>
                            <el-select v-model="rolename" clearable placeholder="请选择角色名称" style="width: 100%">
                                <el-option v-for="item in Rolename" :key="item" :label="item" :value="item" :disabled="item.disabled">
                                </el-option>
                            </el-select>
                        </template>
                    </el-form-item>

                    <el-button type="primary" @click="submitSearchAuthorization">查询</el-button>

                    <el-button type="success" @click="submitAddAuthorization">授权</el-button>
                </el-form>
            </el-row>
            <el-tree
                :data="tree"
                show-checkbox
                default-expand-all
                node-key="moudlecode"
                ref="tree"
                highlight-current
                check-strictly
                :props="defaultProps"
            >
            </el-tree>
            <!-- 角色授权-编辑弹出框 -->
            <el-dialog title="角色授权" :visible.sync="editVisible" width="60%">
                <el-tree
                    :data="tree"
                    show-checkbox
                    default-expand-all
                    node-key="moudlecode"
                    ref="treedit"
                    highlight-current
                    check-strictly
                    :props="defaultProps"
                >
                </el-tree>
                <span slot="footer" class="dialog-footer">
                    <el-button @click="editVisible = false">取 消</el-button>
                    <el-button type="primary" @click="save">确 定</el-button>
                </span>
            </el-dialog>
        </el-card>
    </div>
</template>

<script>
import { listAllSysModuleByCondition, editSysRoleModuleByCondition } from '../../../api/module/systemManagement/RoleAuthorization.js';
import { listAllSysRole } from '../../../api/module/systemManagement/RoleManagement.js';
export default {
    data() {
        return {
            editVisible: false,
            tree: [], //角色树
            Rolename: [], //角色名下拉
            rolename: '', //当前被选中角色名称
            moduleCodes: [], //权限列表
            RoleModule: {
                moduleCodes: [],
                roleName: ''
            },
            defaultProps: {
                children: 'subs',
                label: 'moudlename'
            }
        };
    },
    created() {
        this.listAllSysRole();
    },
    methods: {
        //获取下拉列表
        listAllSysRole() {
            listAllSysRole().then((res) => {
                console.log('角色角色角色角色角色角色角色下拉下拉下拉下拉下拉下拉下拉下拉下拉下拉下拉');
                console.log(res);
                this.Rolename = res.data;
            });
        },
        //授权查询
        setCheckedKeys() {
            this.$refs.tree.setCheckedKeys(this.moduleCodes);
        },
        // //授权编辑框弹出
        // setCheckedKeys() {
        //         this.$refs.treedit.setCheckedKeys(this.moduleCodes);
        // },
        //权限node-key查询
        getCheckedKeysedit() {
            return this.$refs.treedit.getCheckedKeys();
            console.log($refs.treedit.getCheckedKeys());
        },
        getHalfCheckedKeysedit() {
            console.log(this.$refs.treedit.getHalfCheckedKeys());
            return this.$refs.treedit.getHalfCheckedKeys();
        },
        //按角色名查询权限
        submitSearchAuthorization() {
            listAllSysModuleByCondition(this.rolename).then((res) => {
                this.$nextTick(() => {
                    console.log('角色角色角色角色角色角色权限权限权限权限权限查询查询查询查询查询查询查询');
                    console.log(res);
                    this.tree = res.data.allSysModule;
                    this.moduleCodes = res.data.moduleCodes;
                    console.log(this.moduleCodes);
                    this.setCheckedKeys();
                });
            });
        },
        //修改授权
        editSysRoleModuleByCondition() {
            editSysRoleModuleByCondition(this.RoleModule).then((res) => {
                console.log('角色角色角色角色角色角色角色授权授权授权授权授权授权');
                console.log(res);
                this.$message.success(`修改权限成功`);
            });
        },
        submitAddAuthorization() {
            this.editVisible = true;
            // this.setCheckedKeysedit()
            this.$nextTick(() => {
                this.$refs.treedit.setCheckedKeys(this.moduleCodes);
            });
        },
        save() {
            this.editVisible = false;
            this.RoleModule.moduleCodes = this.getCheckedKeysedit();
            // this.RoleModule.moduleCodes.push(this.getHalfCheckedKeysedit()[0])
            console.log(this.RoleModule.moduleCodes);
            this.RoleModule.roleName = this.rolename;
            this.editSysRoleModuleByCondition();
        }
    }
};
</script>

<style>
</style>